{#
  This Source Code Form is subject to the terms of the Mozilla Public
  License, v. 2.0. If a copy of the MPL was not distributed with this
  file, You can obtain one at https://mozilla.org/MPL/2.0/.
#}

{% extends "firefox/welcome/base.html" %}

{% set _entrypoint = 'mozilla.org-firefox-welcome-15' %}
{% set _utm_campaign = 'welcome-15-vpn' %}

{% block page_css %}
  {{ css_bundle('protocol-picto') }}
  {{ css_bundle('firefox_welcome_page15') }}
{% endblock %}

{% block body_class %}welcome-page15{% endblock %}

{% if LANG == 'de' %}
  {% set page_title = 'Must-have für den Sommerurlaub — Mozilla VPN' %}
  {% set main_title = 'Dein Must-have für den Sommerurlaub' %}
  {% set main_tagline = 'Schütze deine Daten, wenn du dich mit einem offenen Netzwerk im Hotel oder Flughafen verbindest, damit deine persönlichen Informationen (wie dein Online-Banking) sicher sind.' %}
  {% set cta_text = 'Probier Mozilla VPN aus' %}
  {% set utility_link_copy = 'Warum wird mir das angezeigt?' %}
{% elif LANG == 'fr' %}
  {% set page_title = 'L’indispensable pour vos vacances — Mozilla VPN' %}
  {% set main_title = 'L’indispensable pour vos vacances' %}
  {% set main_tagline = 'Protégez vos données lorsque vous vous connectez au Wi-Fi d’un hôtel ou aéroport afin d’accéder à vos informations personnelles (comme votre compte bancaire) en toute sécurité.' %}
  {% set cta_text = 'Essayer Mozilla VPN' %}
  {% set utility_link_copy = 'Pourquoi me montre-t-on cette page ?' %}
{% elif LANG == 'en-GB' %}
  {% set page_title = 'Your summer holiday must-have — Mozilla VPN' %}
  {% set main_title = 'Your summer holiday <br>must-have'|safe %}
  {% set main_tagline = 'Protect your data when connecting to hotel or airport Wi-Fi so you can feel secure accessing personal info (like your bank account).' %}
  {% set cta_text = 'Try Mozilla VPN' %}
  {% set utility_link_copy = 'Why am I seeing this?' %}
{% else %}
  {% set page_title = 'Your summer vacation must-have — Mozilla VPN' %}
  {% set main_title = 'Your summer vacation <br>must-have'|safe %}
  {% set main_tagline = 'Protect your data when connecting to hotel or airport Wi-Fi so you can feel secure accessing personal info (like your bank account).' %}
  {% set cta_text = 'Try Mozilla VPN' %}
  {% set utility_link_copy = 'Why am I seeing this?' %}
{% endif %}

{% block page_title %}{{ page_title }}{% endblock %}
{% block page_image %}{{ static('img/products/vpn/common/social-share.png') }}{% endblock %}

{% block shoulder_logo %}
  {{ picture(
    url="img/logos/firefox/logo-word-hor.svg",
    sources=[
      {
        "media": "(prefers-color-scheme: light)",
        "srcset": {
          "img/logos/firefox/logo-word-hor.svg": "default",
        }
      },
      {
        "media": "(prefers-color-scheme: dark)",
        "srcset": {
          "img/logos/firefox/logo-word-hor-white.svg": "default",
        }
      }
    ],
    optional_attributes={
      "class": "c-header-logo",
      "alt": "Firefox",
      "width": "120",
      "height": "40",
    }
  ) }}
{% endblock %}

{% block shoulder_cta %}{% endblock %}

{% block content_primary %}
      <img class="c-main-logo" src="/media/protocol/img/logos/mozilla/vpn/logo-flat.svg" width="60" alt="Mozilla VPN">
      <h1 class="c-main-title">{{ main_title }}</h1>

      <div class="c-main-image">
        {{ picture(
          url="img/firefox/welcome/page15/hero-light.svg",
          sources=[
            {
              "media": "(prefers-color-scheme: light)",
              "srcset": {
                "img/firefox/welcome/page15/hero-light.svg": "default",
              }
            },
            {
              "media": "(prefers-color-scheme: dark)",
              "srcset": {
                "img/firefox/welcome/page15/hero-dark.svg": "default",
              }
            }
          ],
          optional_attributes={
            "alt": "",
            "width": "600",
            "height": "300",
          }
        ) }}
      </div>
{% endblock %}
{% block content_secondary %}
      <p class="c-main-tagline">
        {{ main_tagline }}
      </p>
{% endblock %}
{% block secondary_cta %}
      {{ vpn_product_referral_link(
        referral_id='welcome-page15',
        link_to_pricing_page=True,
        link_text=cta_text,
        class_name='mzp-t-product mzp-t-xl',
        optional_attributes= {
              'data-cta-text' : 'Try Mozilla VPN',
              'data-cta-type' : 'button'
        }
      )}}
{% endblock %}

{% block content_utility %}
      <p>
        <strong>
          <a href="https://support.mozilla.org/kb/firefox-browser-welcome-pages/?utm_source={{ _entrypoint }}&utm_medium=referral&utm_campaign={{ _utm_campaign }}&entrypoint={{ _entrypoint }}">
            {{ utility_link_copy }}
          </a>
        </strong>
      </p>
{% endblock %}
